<template>

    <!-- 添加或修改对话框 -->
    <lam-dialog :title="title" :visible.sync="open" width="680px" append-to-body @close="cancel">
      <el-form :ref="formRef" :model="form" :rules="rules" label-width="100px" :disabled="formDisabled">
        <el-row>
<#list columns as column>
	<#if column.edit>
		<#if table.simpleTree && column.javaField == treeParentCode> 
          <el-col :span="12">
            <el-form-item label="${column.formItemLabel}" prop="${column.javaField}">
              <treeselect v-model="form.${treeParentCode}" :options="treeData" :show-count="true" placeholder="" />
            </el-form-item>
          </el-col>
		<#elseif column.htmlType == "input"> 
          <el-col :span="12">
            <el-form-item label="${column.formItemLabel}" prop="${column.javaField}">
              <el-input v-model="form.${column.javaField}" clearable placeholder="" />
            </el-form-item>
          </el-col>
		<#elseif column.htmlType == "inputNumber"> 
          <el-col :span="12">
            <el-form-item label="${column.formItemLabel}" prop="${column.javaField}">
              <el-input-number v-model="form.${column.javaField}" clearable controls-position="right" :min="0" style="width: 100%;"/>
            </el-form-item>
          </el-col>
		<#elseif column.htmlType == "select"> 
          <el-col :span="12">
            <el-form-item label="${column.formItemLabel}" prop="${column.javaField}">
              <lam-dict-select v-model="form.${column.javaField}" dictCode="${column.dictCode}" placeholder="" clearable />
            </el-form-item>
          </el-col>
		<#elseif column.htmlType == "checkbox"> 
          <el-col :span="12">
            <el-form-item label="${column.formItemLabel}" prop="${column.javaField}">
              <lam-dict-select type="checkbox" v-model="form.${column.javaField}" dictCode="${column.dictCode}" placeholder=""  />
            </el-form-item>
          </el-col>
		<#elseif column.htmlType == "radio"> 
          <el-col :span="12">
            <el-form-item label="${column.formItemLabel}" prop="${column.javaField}">
              <lam-dict-select type="radio" v-model="form.${column.javaField}" dictCode="${column.dictCode}" placeholder="" />
            </el-form-item>
          </el-col>
		<#elseif column.htmlType == "date"> 
          <el-col :span="12">
            <el-form-item label="${column.formItemLabel}" prop="${column.javaField}">
              <el-date-picker type="date" v-model="form.${column.javaField}" value-format="yyyy-MM-dd" clearable placeholder="" />
            </el-form-item>
          </el-col>
		<#elseif column.htmlType == "datetime"> 
          <el-col :span="12">
            <el-form-item label="${column.formItemLabel}" prop="${column.javaField}">
              <el-date-picker type="datetime" v-model="form.${column.javaField}" value-format="yyyy-MM-dd HH:mm:ss" clearable placeholder="" />
            </el-form-item>
          </el-col>
		<#elseif column.htmlType == "textarea"> 
          <el-col :span="24">
            <el-form-item label="${column.formItemLabel}" prop="${column.javaField}">
              <el-input v-model="form.${column.javaField}" type="textarea" autosize placeholder="" />
            </el-form-item>
          </el-col>
		</#if> 
	</#if> 
</#list> 
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
<#if hasFuncInsert || hasFuncUpdate> 
        <el-button type="primary" @click="submitForm" :loading="loading">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
<#else>
        <el-button @click="cancel">关  闭</el-button>
</#if> 
      </div>
    </lam-dialog>
    
</template>

<script>
<#if table.simpleTree> 
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {httpGet} from '@/api';
</#if> 
import { EditMixin } from '@/components/mixins/EditMixin';

export default {
  name: "Edit${BusinessName}",
  mixins:[EditMixin],
<#if table.simpleTree> 
  components:{
    Treeselect
  },
</#if> 
  data() {
    return {
<#if hasFuncInsert || hasFuncUpdate> 
      url: {
	<#if table.simpleTree> 
        tree: '${urlBase}/treeList',
	</#if> 
        base: '${urlBase}/'
      },
      // 表单校验
      rules: {
	<#list columns as column>
		<#if column.edit> 
			<#if column.unique> 
				<#if column.required> 
        ${column.javaField}: [{required: true, message: "${column.formItemLabel}不能为空", trigger: "blur" }, {validator: this.${uniqueField}UniqueValidator, trigger: 'blur'}],
				<#else> 
        ${column.javaField}: [{validator: this.${uniqueField}UniqueValidator, trigger: 'blur'}],
				</#if> 
			<#else>
				<#if column.required> 
        ${column.javaField}: [{ required: true, message: "${column.formItemLabel}不能为空", trigger: "blur" }],
				<#else>
				</#if> 
			</#if> 
		</#if>
	</#list> 
      },
</#if> 
<#if table.simpleTree>
      treeData:[],
</#if>
    };
  },
  created() {
  },
  methods: {
<#if hasFuncInsert || hasFuncUpdate> 
    // 表单重置
    reset() {
      this.form = {
	<#list columns as column>
		<#if column.edit>
			<#if column.htmlType == "radio" || column.htmlType == "select">
				<#if column.dictCode!="" && column.dictCode == "status_type">
        ${column.javaField}: 1<#if column_has_next>,</#if>
				<#elseif column.javaType == "Integer" || column.javaType == "Long">
        ${column.javaField}: 0<#if column_has_next>,</#if>
				<#else>
        ${column.javaField}: "0"<#if column_has_next>,</#if>
				</#if>
			<#else>
        ${column.javaField}: null<#if column_has_next>,</#if>
			</#if>
		</#if>
	</#list>
      };
    },
	<#if table.simpleTree> 

    /** 查询下拉树列表 */
    loadTreeData(neId){
      httpGet(this.url.tree, {neId: neId}).then(res => {
        this.treeData = res.data;
      });
    },
    
    /** 打开弹窗 */
    openDialog(title, operType, proms, callback) {
      proms = proms instanceof Promise ? proms : new Promise(resolve=>resolve({data:proms}));
      proms.then(res => {
        this.loadTreeData(res.data.id);
        this.openD({
          form: res.data,
          operType: operType,
          title: title
        }, callback);
      });
      //此方法可以在具体的组件里面进行覆盖，可以先调用this.openD(op)方法之后，然后再写自己的具体逻辑
    },
	</#if> 
	<#if (hasFuncInsert || hasFuncUpdate) && hasFuncUnique> 

    ${uniqueField}UniqueValidator(rule, value, callback) {
		<#if !uniqueFieldRequired> 
      if(!value){
        callback(); return;
      }
		</#if> 
		<#if hasConditionField> 
      let param = {
        ${uniqueField}: value, 
			<#list conditionFieldList as cField>
        ${cField}: this.form.${cField}<#if cField_has_next>,</#if>
			</#list> 
      };
		<#else> 
      let param = {${uniqueField}: value};
		</#if> 
      if(this.operType=='update') param.${uniqueQueryField} = this.form.${uniqueQueryField};
      this.checkUniqueAsyn(value, callback, '${uniqueCode}', param);
    },
	</#if> 
    
    /** 提交按钮 */
    submitForm(){
      this.saveForm(this.url.base);
    }
</#if> 

  }
};
</script>
